<%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt" %>
<fmt:setBundle basename="messages.offline"/>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">


<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">

<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">

<title>GPSou</title>
<style type="text/css">
    v\:* {
      behavior:url(#default#VML);
    }
</style>

<script type="text/javascript">
//<![CDATA[

var http_request = false;

var map;
var gMarker;
var points;
var gPolyline;

var timer;

function parseDate(str) {
  var ts=str.split(" ");
  var d=ts[0].split("-");
  var h=ts[1].split(":");
  var s=h[2].split(".");

  var fecha=new Date(Date.UTC(d[0], d[1] - 1, d[2], h[0], h[1], s[0], s[1]));

  return(fecha);
}

function load() {
   if(map == undefined) {
     var script;

     var head = document.getElementsByTagName("head")[0];
     script = document.createElement('script');
     script.type = 'text/javascript';
     script.id = 'mapLib';
     head.appendChild(script);
     script.src = "http://www.google.com/jsapi?key=ABQIAAAANdXnaDQ5-BE42sETh1OnBxQSUI96VjuXJJ7uIyuEjKZOYLINbRQ00Oj1snry5mEp_2LhV3da9mA0JQ&callback=load2";
   } else {
     showMap();
   }
}

function showMap() {
     var mapType=map.getCurrentMapType();
     if(mapType!=G_NORMAL_MAP && mapType!=G_SATELLITE_MAP && mapType!=G_HYBRID_MAP)
        map.setMapType(G_HYBRID_MAP);
     map.setZoom(parent.zoomLevel);
     var point=new GLatLng(parent.latitudAnterior, parent.longitudAnterior);
     map.removeOverlay(gMarker);
     gMarker=new GMarker(point, null);
     map.addOverlay(gMarker);
     point=new GLatLng(parent.latitud, parent.longitud);
     map.panTo(point);

     if(parent.nPoints>1000)
	parent.nPoints=1000;
     if(points.length + parent.nPoints > 1000)
	points.slice(points.length + parent.nPoints - 1000);
     var point;
     for(i=parent.latitudes.length - parent.nPoints;i<parent.latitudes.length;i++) {
        point = new GLatLng(parent.latitudes[i], parent.longitudes[i]);
	points.push(point);
     }
     parent.nPoints=0;

     mapMostrarRuta();

     if(parent.reproducir)
	timer=window.setTimeout("mueve();", 1000);
}

function load2() {
     google.load("maps", "2", {"callback" : init});
}

function init() {
     var script;
     var head = document.getElementsByTagName("head")[0];
     script = document.createElement('script');
     script.type = 'text/javascript';
     script.id = 'pano1';
     head.appendChild(script);
     script.src = "../scripts/markermanager.js";

     script = document.createElement('script');
     script.type = 'text/javascript';
     script.id = 'pano2';
     head.appendChild(script);
     script.src = "../scripts/pano_layer.js";

     script = document.createElement('script');
     script.type = 'text/javascript';
     script.id = 'pano3';
     head.appendChild(script);
     script.src = "../scripts/pano_maptypecontrol.js";

    if(parent.ruta == undefined) {
    	var url="/VEGPS/ServletGoogleGPS?p=getRuta&desde="+parent.desde+"&hasta="+parent.hasta;

	points=[];

        if (window.XMLHttpRequest) { // Mozilla, Safari,...
            http_request = new XMLHttpRequest();
            if (http_request.overrideMimeType) {
                http_request.overrideMimeType('text/xml');
            }
        } else if (window.ActiveXObject) { // IE
            try {
                http_request = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e) {
                try {
                http_request = new ActiveXObject("Microsoft.XMLHTTP");
                 } catch (e) {}
            }
        }

        if (!http_request) {
            alert('Giving up :( Cannot create an XMLHTTP instance');
            return false;
        }
        http_request.onreadystatechange = alertContents;
        http_request.open('GET', url, true);
        http_request.send(null);
    } else {
	loadMaps();
    }
}

function switchMap() {
  clearTimeout(timer);
  parent.zoomLevel=map.getZoom();
  var centerPos=map.getCenter();
  parent.latitud=centerPos.lat();
  parent.longitud=centerPos.lng();
  parent.document.getElementById("VE").style.display="block";
  parent.document.getElementById("GM").style.display="none";
  parent.WIN=parent.frames['VE'];

  parent.VE.load();
}

function alertContents() {
    if (http_request.readyState == 4) {
        if (http_request.status == 200) {
            parent.datos=http_request.responseText;
    	    parent.ruta=parent.datos.split("#");

            if(parent.ruta.length<=1) {
                alert("No hay datos de recorrido en el intervalo de tiempo seleccionado");
                history.back(1);
	    } else {
    		results=parent.ruta[1].split(";");

    		var grados;
    		var latitudNMEA=results[1];
    		var longitudNMEA=results[2];
    		grados=Math.floor(latitudNMEA/1000000);
    		if(grados<0)
			grados=grados+1;
    		parent.latitudAnterior=(latitudNMEA/1000000-grados)/0.6+grados;
    		grados=Math.floor(longitudNMEA/1000000);
    		if(grados<0)
			grados=grados+1;
    		parent.longitudAnterior=(longitudNMEA/1000000-grados)/0.6+grados;

		loadMaps();
	    }
        } else {
            alert('Se ha producido un error al obtener la ruta.');
            history.back(1);
        }
    }
}


function loadMaps() {
    if(typeof(PanoMapTypeControl)=="undefined") {
        window.setTimeout("loadMaps();", 100);
        return;
    }

    if (GBrowserIsCompatible()) {
        parent.document.getElementById("espera").style.display="none";
        parent.document.getElementById("pagina").style.display="block";

	map = new GMap2(document.getElementById("map"));

	gMarker=new GMarker(0, 0);
	points = [];

	map.addMapType(G_SATELLITE_3D_MAP);
	map.addControl(new GSmallMapControl());
	map.addControl(new GMapTypeControl());
        map.setCenter(new GLatLng(0, 0), 16);
	map.addControl(new PanoMapTypeControl());
        map.enableScrollWheelZoom();
        map.enableContinuousZoom();
	map.setMapType(G_HYBRID_MAP);

	showMap();
    }
}


function mueve() {

    parent.i=parent.i+parent.direccion;
    if(parent.i<1)
      parent.i=1;
    if(parent.i>parent.ruta.length-1)
      parent.i=parent.ruta.length-1;

    try {
      results=parent.ruta[parent.i].split(";");

      var grados;
      var latitudNMEA=results[1];
      var longitudNMEA=results[2];

      grados=Math.floor(latitudNMEA/1000000);
      if(grados<0)
	grados=grados+1;
      var latitud=(latitudNMEA/1000000-grados)/0.6+grados;
      grados=Math.floor(longitudNMEA/1000000);
      if(grados<0)
	grados=grados+1;
      var longitud=(longitudNMEA/1000000-grados)/0.6+grados;

      var dx=6370*(latitud-parent.latitudAnterior)*Math.PI/180;
      var dy=6370*Math.cos(latitud*Math.PI/180)*(longitud-parent.longitudAnterior)*Math.PI/180;
      parent.distancia+=parent.direccion*Math.sqrt(Math.pow(dx,2)+Math.pow(dy,2));
      parent.latitudAnterior=latitud;
      parent.longitudAnterior=longitud;

      var point = new GLatLng(latitud, longitud);
      if(points.length>=1000) {
	points.shift();
	parent.latitudes.shift();
	parent.longitudes.shift();
      }
      points.push(point);
      parent.latitudes.push(latitud);
      parent.longitudes.push(longitud);
      parent.nPoints+=1;

      if(parent.mostrarRuta) {
	if(gPolyline!=undefined)
	  map.removeOverlay(gPolyline);
	gPolyline=new GPolyline(points);
	map.addOverlay(gPolyline);
      }

      map.removeOverlay(gMarker);
      gMarker=new GMarker(point, null);
      map.addOverlay(gMarker);

      var fecha=parseDate(results[0]);
      var velocidad=Math.round(results[3] / 10);
      var altitud=results[5];

      map.panTo(point);

      parent.document.getElementById("fecha").innerHTML=fecha.toLocaleDateString();
      parent.document.getElementById("hora").innerHTML=fecha.toLocaleTimeString();
      parent.document.getElementById("velocidad").innerHTML=velocidad + " km/h";
      parent.document.getElementById("distancia").innerHTML=Math.round(parent.distancia*1000)/1000 + " km";
      parent.document.getElementById("altitud").innerHTML=altitud + " m";
      
    
    } catch (err) {alert(err.description);}
    if(parent.reproducir==true)
      timer=window.setTimeout("mueve();", 1000);
}

function fBack() {
    parent.direccion=-1;
    parent.document.getElementById("forwardBtn").className="off";
    parent.document.getElementById("backBtn").className="on";
}


function play(boton) {
  if(parent.reproducir) {
    boton.value="<fmt:message key="button.play.2"/>";
    boton.title="<fmt:message key="button.play.title.2"/>";
    parent.document.getElementById("stepBtn").style.visibility="visible";
    parent.reproducir=false;
    clearTimeout(timer);
  } else {
    boton.value="<fmt:message key="button.play.1"/>";
    boton.title="<fmt:message key="button.play.title.1"/>";
    parent.document.getElementById("stepBtn").style.visibility="hidden";
    parent.reproducir=true;
    timer=window.setTimeout("mueve();", 1000);
  }
}

function fForward() {
    parent.direccion=1;
    parent.document.getElementById("forwardBtn").className="on";
    parent.document.getElementById("backBtn").className="off";
}

function step() {
    if(parent.reproducir==false)
      mueve();
}

function fReset() {
    parent.distancia=0;
    parent.document.getElementById("distancia").innerHTML="0 km";
    
}

function fMostrarRuta(boton) {
    if(parent.mostrarRuta) {
      boton.value="<fmt:message key="button.route.1"/>";
      boton.title="<fmt:message key="button.route.title.1"/>";
      parent.mostrarRuta=false;
    } else {
      boton.value="<fmt:message key="button.route.2"/>";
      boton.title="<fmt:message key="button.route.title.2"/>";
      parent.mostrarRuta=true;
    }
    mapMostrarRuta();
}

function mapMostrarRuta() {
    if(gPolyline!=undefined) {
      map.removeOverlay(gPolyline); 
      gPolyline=undefined;
    }
    if(parent.mostrarRuta) {
      gPolyline=new GPolyline(points);
      map.addOverlay(gPolyline);
    }
}

function unload() {
  GUnload();
}

//]]>
</script>

</head>

<body onunload="unload()">
  <div id="map" style="width: 500px; height: 300px"></div>
</body>

</html>


